<template>
  <el-row :gutter="20">
    <el-col :span="24">
      <el-col :span="16"
              class="button-same">
        <el-button size="medium"
                   @click="onSyn"
                   v-auth="'cons-pro-commit'">同步</el-button>&nbsp;
      </el-col>
      <el-col :span="8">
        <el-form :model="formPro">
          <el-form-item label="项目名称:"
                        label-width="100px"
                        size="medium">
            <el-input v-model="formPro.proName"
                      size="medium"
                      suffix-icon="el-icon-search"
                      placeholder="请输入"
                      @blur="onInputBlur"></el-input>
          </el-form-item>
        </el-form>
      </el-col>
    </el-col>
    <el-col class="table-box">
      <el-table stripe
                style="width: 100%"
                :header-cell-style="{ background: '#f5f5f5' }"
                :data="tableData">
        <el-table-column type="index"
                         label="序号"
                         align="center"
                         width="100"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column label="时间"
                         prop="add_time"
                         align="center"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column label="项目名称"
                         prop="project_name"
                         align="center"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="duty_org"
                         label="总承包单位"
                         align="center"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="struct_area"
                         label="装配式建筑面积(m²)"
                         align="center"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="pre_rate"
                         label="预制率(%)"
                         align="center"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="cop_num"
                         label="构件总数(个)"
                         align="center"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column label="操作"
                         width="260px"
                         align="center">
          <template slot-scope="scope">
            <el-button type="text"
                       @click="onLook(scope.row)">查看</el-button>
            <el-button type="text"
                       @click="onEdit(scope.row)">修改</el-button>
            <!-- <el-button type="text">明细</el-button> -->
            <el-button type="text"
                       v-auth="'company-issue-button'"
                       @click="onCompanyIssu(scope.row)">单位分配</el-button>
            <el-button type="text"
                       @click="onDel(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-col>
    <el-col :span="24"
            style="margin-top:20px!important;">
      <el-pagination @size-change="handleSizeChange"
                     @current-change="handleCurrentChange"
                     :current-page="page"
                     :page-sizes="[10, 20, 50, 100,200]"
                     :page-size="page_size"
                     align="center"
                     layout="total, sizes, prev, pager, next, jumper"
                     :total="total">
      </el-pagination>
    </el-col>
    <!-- 查看 -->
    <el-dialog :title="todos==1?'新增项目':todos==2?'修改项目':'查看项目'"
               :visible.sync="dialogVisiblePro"
               width="45%"
               :before-close="handleClose">
      <AddOrEditConsProDialog :todos="todos"
                              :catchBack="catchBack"
                              :catchSave="catchSave"
                              :detailObj="detailObj"></AddOrEditConsProDialog>
    </el-dialog>
    <el-dialog title="单位分配"
               :visible.sync="companyIssuDialog"
               width="40%"
               :before-close="companyIssuhandleClose">
      <el-row :span="20">
        <el-form :model="requestComIssuParams"
                 :rules="rules"
                 label-width="80px"
                 ref="form">
          <el-col :span="24">
            <el-form-item label="单位分配"
                          prop="jt_org_id">
              <el-select v-model="requestComIssuParams.jt_org_id"
                         size="medium"
                         class="select-style">
                <el-option v-for="item in comIssuArr"
                           :key="item.jt_org_id"
                           :label="item.org_name"
                           :value="item.jt_org_id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24"
                  class="bottom-style">
            <el-button size="medium"
                       @click="onBack">取消</el-button>
            <el-button size="medium"
                       type="primary"
                       @click="onSave('form')">确定</el-button>
          </el-col>
        </el-form>
      </el-row>
    </el-dialog>
  </el-row>
</template>

<script>
import AddOrEditConsProDialog from './addOrEditConsProDialog'
import { DesignManageApi, ConstrucManagementApi } from '@/services/WorkCenter'
import { standardCodeApi } from '@/services/StandardCode'
export default {
  components: {
    AddOrEditConsProDialog
  },
  data () {
    return {
      companyIssuObj: {},
      comIssuArr: [],
      requestComIssuParams: {
        jt_org_id: ''
      },
      rules: {
        jt_org_id: [
          { required: true, message: '所属单位不能为空', trigger: 'change' }
        ]
      },
      companyIssuDialog: false,
      detailObj: {},
      todos: 0,
      dialogVisiblePro: false,
      formPro: {
        proName: ''
      },
      tableData: [],
      total: 0,
      page: 1,
      page_size: 10
    }
  },
  methods: {
    getAuth (name) {
      // let flag = util.getAuth(name)
      // console.log('flag=',flag)
      return false
    },
    //单位分配-取消
    onBack () {
      this.requestComIssuParams.jt_org_id = '';
      this.companyIssuDialog = false;
      this.$refs['form'].resetFields();
    },
    //单位分配-确定
    onSave (data) {
      this.$refs[data].validate((valid) => {
        if (valid) {
          ConstrucManagementApi.consCompanyIssu({
            data: {
              jt_org_id: this.requestComIssuParams.jt_org_id,
              jt_project_id: this.companyIssuObj.jt_project_id
            }
          }).then((res) => {
            if (res.code == 0) {
              this.companyIssuObj = {}
              this.onBack();
              this.$message.success('操作成功')
              this.handleCurrentChange(1)
            }
          }).catch((error) => {
            console.log(error)
          })
        } else {
          console.log('error')
        }
      })
    },
    //获取单位分配下拉接口
    getConsCompanyArr () {
      return DesignManageApi.getOrgList({
        params: {
          // type:3,
          list_or_tree: 'list'
        }
      }).then((res) => {
        this.comIssuArr = res.data.list;
        console.log('90res=', res)
      }).catch((error) => {
        console.log(error)
      })
    },
    //单位分配
    onCompanyIssu (row) {
      this.companyIssuObj = row;
      this.requestComIssuParams.jt_org_id = Number(row.jt_org_id);
      this.companyIssuDialog = true;
    },
    //单位分配关闭前触发的事件
    companyIssuhandleClose (done) {
      done()
    },
    //失去焦点触发该事件
    onInputBlur () {
      this.handleCurrentChange(1);
    },
    onSyn () {
      DesignManageApi.proCommit({
        params: {

        }
      }).then((res) => {
        if (res.code == 0) {
          this.$message.success('同步成功')
          this.handleCurrentChange(1);
        }
      }).catch((error) => {
        console.log(error)
      })
    },
    //点击取消时子组件触发事件
    catchBack () {
      this.detailObj = {};
      this.todos = 0;
      this.dialogVisiblePro = false;
    },
    //点击确定时子组件触发事件
    catchSave () {
      this.handleCurrentChange(1)
      this.catchBack();
    },
    //新增
    onAdd () {
      this.todos = 1;
      this.dialogVisiblePro = true;
    },
    //查看
    onLook (row) {
      this.detailObj = row;
      this.todos = 3;
      this.dialogVisiblePro = true;
    },
    //编辑
    onEdit (row) {
      this.detailObj = row;
      this.todos = 2;
      this.dialogVisiblePro = true;
    },
    //删除
    onDel (row) {
      this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        left: true
      }).then(() => {
        DesignManageApi.delProject({
          data: {
            id: row.jt_project_id
          }
        }).then((res) => {
          if (res.code == 0) {
            this.$message.success('操作成功')
            this.handleCurrentChange(1)
          }
        }).catch((error) => {
          console.log(error)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    handleClose (done) {
      this.catchBack();
      done();
    },
    //每页显示的条数
    handleSizeChange (val) {
      this.page_size = val;
      this.handleCurrentChange(1)
    },
    //当前页变化时触发的事件
    handleCurrentChange (val) {
      this.page = val;
      this.getDesignOrgData()
    },
    getDesignOrgData () {//列表数据
      return ConstrucManagementApi.getProjectList({
        params: {
          project_name: this.formPro.proName,
          is_page: 1,
          page: this.page,
          page_size: this.page_size,
          business_type: 3,//1:工业化设计管理；2：工业化生产管理；3：工业化施工管理
        }
      }).then((res) => {
        this.tableData = res.data.list;
        console.log('tabledata=', this.tableData)
        this.total = res.data.total_count;
      }).catch((error) => {
        console.log(error)
      })
    }
  },
  async created () {

    console.log('测试res90=')
    await this.getConsCompanyArr();//单位分配下拉框
    await this.getDesignOrgData();//列表数据
  }
}
</script>

<style lang="scss" scoped>
.button-same {
  padding-left: 0px !important;
}
.select-style {
  width: 100%;
}
.bottom-style {
  text-align: right;
}
// /deep/ .el-dialog__body{
//   padding-top:10px!important;
// }
</style>